<template id="img_view">
    <div class="m-img-view" @click="eClick">
        <div class="u-mask"></div>
        <div class="u-img">
            <img :src="src"/>
        </div>
    </div>
</template>
<script>
 // es6...
    export default {
        props:['src'],
        methods:{
            eClick(){
                this.$emit('click')
            }
        }
    }

// Vue.component('img-views',{
//     template:'#img_view',
//     props:['src'],
//     methods:{
//         eClick:function(){
//             this.$emit('clickit');
//         }
//     }
// });
</script>
<style>
    .m-img-view{
        /*样式自己写吧，不是很难*/
    }
    .u-mask{
        /*背景全屏全黑，应该知道怎么写吧。。。*/
        background: #000;
    }
    .u-img{
        /*中间那块图片部分*/
        position: absolute;
        text-align: center;
    }
</style>
